<template>
  <div>
    <el-button text @click="toggleFullscreen">
      <span>
        <svg-icon :iconClass="isFullscreen ? 'narrow' : 'full'"></svg-icon>
      </span>
    </el-button>
  </div>
</template>

<script setup>
  import { useFullscreen } from '@vueuse/core'
  const { toggle, isFullscreen } = useFullscreen()

  const toggleFullscreen = () => {
    toggle()
  }
</script>

<style scoped lang="scss"></style>
